import Data from '@/api/data'
import permission from '@/directive/permission'
import Cookie from 'js-cookie'
import {TokenType} from '@/utils/enum'

const baseURL = process.env.VUE_APP_BASE_API

export default {
  directives: { permission },
  data() {
    return {
      //条件查询数据
      statusOptions: [ // 可选  查询状态下拉选择 状态
        {value: 'NORMAL', label: '正常'},
        {value: 'DISABLE',label: '失效'},
      ],
      listQuery: {
        page: 1,
        size: 10,
        status: "",
        type:"",
        type1:"",
        type2:"",
        key: '',
      },
      typeOptions: [
        {value: '通知公告', label: '通知公告'},
        {value: '行业动态',label: '行业动态',children:[
          {value: '协会新闻', label: '协会新闻'},
          {value: '行业动态', label: '行业动态'},
          {value: '协会期刊', label: '协会期刊'},
        ]},
        {value: '党建工作', label: '党建工作'},
        {value: '会员信息', label: '会员信息', children:[
          {value: '会员掠影', label: '会员掠影'},
          {value: '信息交流', label: '信息交流'},
          {value: '企业活动', label: '企业活动'},
        ]},
      ],

      //中间表格数据
      list: [], // 数据列表
      total: 0, // 数据总数
      listLoading: true, // 加载显示效果 true加载显示 false加载隐藏

      //新增与修改
      drawer: false,
      detailData:{},
      formData: {
        img:"",
        title: '',
        type: '',
        content:'',
        source: "",
      },
      branchList: "",
      imgError: "",
      imgTypeList:[".jpg",".png"],
      subing: false,
      baseURL: baseURL,

      //新增&修改-编辑器
      editDrawer: false,
      editor: null,
      toolbarConfig: { },
      editorConfig: {
        MENU_CONF: {
          uploadImage: {
            server: baseURL + '/cos/upload?type=article_editor_img',
            // form-data fieldName ，默认值 'wangeditor-uploaded-image'
            fieldName: 'file',
            // 单个文件的最大体积限制，默认为 2M
            maxFileSize: 1 * 1024 * 1024, // 1M
            // 最多可上传几个文件，默认为 100
            maxNumberOfFiles: 10,
            // 选择文件时的类型限制，默认为 ['image/*'] 。如不想限制，则设置为 []
            allowedFileTypes: ['image/*'],
            // 自定义上传参数，例如传递验证的 token 等。参数会被添加到 formData 中，一起上传到服务端。
            meta: {
                // token: 'xxx',
                // otherKey: 'yyy'
            },
            // 将 meta 拼接到 url 参数中，默认 false
            metaWithUrl: false,
            // 自定义增加 http  header
            headers: {
              authorization: 'Bearer ' + Cookie.get(TokenType.USER_TOKEN)
            },

            // 跨域是否传递 cookie ，默认为 false
            withCredentials: true,

            // 超时时间，默认为 10 秒
            timeout: 5 * 1000, // 5 秒

            // 上传之前触发
            onBeforeUpload(file) {    // JS 语法
                // file 选中的文件，格式如 { key: file }
                return file
                // 可以 return
                // 1. return file 或者 new 一个 file ，接下来将上传
                // 2. return false ，不上传这个 file
            },

            // 上传进度的回调函数
            onProgress(progress) {       // JS 语法
                // progress 是 0-100 的数字
                console.log('progress', progress)
            },

            // 单个文件上传成功之后
            onSuccess(file, res) {          // JS 语法
                console.log(`${file.name} 上传成功`, res)
            },

            // 单个文件上传失败
            onFailed(file, res) {           // JS 语法
                console.log(`${file.name} 上传失败`, res)
            },

            // 上传错误，或者触发 timeout 超时
            onError(file, err, res) {               // JS 语法
                console.log(`${file.name} 上传出错`, err, res)
            },

            // 自定义插入图片
            customInsert(res, insertFn) {                  // JS 语法
                // res 即服务端的返回结果
                console.log("res::", res)
                // 从 res 中找到 url alt href ，然后插入图片
                insertFn(res.url, "", "")
            },

          }

        },
        placeholder: '请输入内容...' ,
      },
      mode: 'default', // or 'simple'

      //文章预览
      drawer3: false,
    }
  },
  created() {
    this.branchload();
    this.fetchList()

  },
  methods: {
    branchload() {
      Data.get("/branch", {size: 90}).then(res=>{
        this.branchList = res.list
      })
    },
    selectChange(){
      // 改变分页显示条数始终跳回第一页
      this.listQuery.page = 1
    },
    async fetchList() {
      this.listLoading = true
      const obj = JSON.parse(JSON.stringify(this.listQuery))
      for (const key in obj) {
        if (obj[key] === null || obj[key] === '') {
          delete obj[key]
        }
      }
      //参数转换
      if(this.listQuery.type && this.listQuery.type.length > 0) {
        obj['type1'] = this.listQuery.type[0]
      }
      if(this.listQuery.type && this.listQuery.type.length > 1) {
        obj['type2'] = this.listQuery.type[1]
      }
      delete obj['type']
      console.log('wwwwwwwwwwwwwwwwwwwwwwwww')
      console.log(obj)
      const res = await Data.get("/article", obj)
      this.listLoading = false
      if (res) {
        this.list = res.list
        this.total = res.total
      }
    },
    async deleteById(id) {
      var res = await Data.deleteById("/article/" + id);
      if(res) {
        this.$notify.success({
          message: "文章删除成功！"
        })
        for(var i = this.list.length-1; i >=0; i--) {
          if(this.list[i].id == id) {
            this.list.splice(i, 1)
          }
        }
      }
    },
    async statusChange(row) {
      var isNormal = row.status.split(":")[0] == 'NORMAL';
      var data = {id: row.id, status: isNormal ? 'DISABLE':'NORMAL'};
      var res = await Data.post("/article/statusChange", data)
      if(res) {
        this.$notify.success({message: "操作成功！"})
        Object.assign(row, {status: isNormal ? 'DISABLE:失效':'NORMAL:正常'})
      }
    },
    onCreated(editor) {
      this.editor = Object.seal(editor) // 一定要用 Object.seal() ，否则会报错
    },
    beforeDestroy() {
      const editor = this.editor
      if (editor == null) return
      editor.destroy() // 组件销毁时，及时销毁编辑器
    },
    handleClose(done) {
      this.$confirm('确认关闭？')
        .then(_ => {
          done();
        })
        .catch(_ => {});
    },
    openEditor() {
      this.$refs['saveForm'].validate(async (valid) => {
        if (valid) {
          this.drawer = false
          this.editDrawer = true
        } else {
          console.log('error submit!!');
          return false;
        }
      });
    },
    async save() {
      this.subing = true
      //参数转换
      var data = {...this.formData}
      if(this.formData.type && this.formData.type.length > 0) {
        data['type1'] = this.formData.type[0]
      }
      if(this.formData.type && this.formData.type.length > 1) {
        data['type2'] = this.formData.type[1]
      }
      delete data['type']
      console.log(this.formData)
      console.log(data)
      if(this.formData.id) {
        var res = await Data.post("/article/update", data);
        if(res) {
          console.log("结果",res)
          Object.assign(this.currentRow, res);//更新行数据
          this.$notify.success({
            message: '文章属性修改成功',
          });
        }
      } else {
        var res = await Data.post("/article", data);
        if(res) {
          // res['submitUserName'] = sessionStorage.getItem("userName");
          // res["fileList"] = []
          this.list.unshift(res);
          //上传附件
          this.$notify.success({
            message: '文章新增成功',
          });
        }
      }
      //新增修改统一操作
      this.saveClose()
      this.subing = false
    },
    saveClose() {
      this.formData = {}
      // this.$refs['saveForm'].resetFields();
      this.editDrawer = false
    },
    update(row) {
      this.drawer = true;
      this.currentRow = row
      var type = []
      if(row.type1) {
        type.push(row.type1)
      }
      if(row.type2) {
        type.push(row.type2)
      }
      this.formData = {...row,type: type}

    },
    imgCheck(file) {
      var maxSize = 1024 * 1024 * 2
      var type = "." + file.name.split(".")[1]
      if (this.imgTypeList.indexOf(type) < 0 || file.size > maxSize) {
        this.imgError = "只能上传2M以内的.jpg/.png图片"
        return false;
      }
      return true;
    },
    imgUpload(response, file, fileList) {
      if(response) {
        console.log("img", response.url)
        this.formData["img"] = response.url
        this.formData["imgList"] = fileList
        this.$refs['saveForm'].validateField("img",()=>{})
      }
    },
    async opened() {
      var node = document.getElementById("articleView");
      node.innerHTML = this.detailData.content
    },
    token() {
      return Cookie.get(TokenType.USER_TOKEN);
    },

  },

}
